import { ref, computed } from 'vue'
import { parseTime, formatTime } from './timeFormat'

interface IOptions {
  /** 倒计时时长，类型number */
  time: number
  /** 倒计时显示格式，'mm:ss' */
  format: string
  /** 倒计时结束回调 */
  onFinish?: () => void
}
/**
 * 倒计时函钩子数
 */
export default (options: IOptions) => {
  /**
   * 定义一个变量，表示是否正在倒计时
   */
  let isCounting = false
  // 使用ref函数创建一个响应式变量，表示剩余时间
  const remain = ref(options.time)
  // 使用ref函数创建一个响应式变量，表示倒计时结束时间
  const endTime = ref<number>(0)
  // 使用computed函数创建一个计算属性，表示当前时间
  const currentTime = computed(() =>
    formatTime(options.format, parseTime(remain.value))
  )

  // 获取当前剩余时间
  const getCurrentRemain = () => Math.max(endTime.value - Date.now(), 0)

  // 设置剩余时间
  const setRemain = (val: number) => {
    remain.value = val
    // 如果剩余时间为0，则调用options中的onFinish函数，并将counting设置为false
    if (val == 0) {
      options.onFinish?.()
      isCounting = false
    }
  }

  // 倒计时函数
  const tickTime = () => {
    // 使用requestAnimationFrame函数实现倒计时
    requestAnimationFrame(() => {
      // 设置剩余时间
      setRemain(getCurrentRemain())
      // 如果剩余时间大于0，则继续倒计时
      if (remain.value > 0) {
        tickTime()
      }
    })
  }

  // 开始倒计时函数
  const start = () => {
    // 如果正在倒计时，则直接返回
    if (isCounting) return
    // 将counting设置为true
    isCounting = true
    // 设置倒计时结束时间
    endTime.value = Date.now() + remain.value
    // 开始倒计时
    tickTime()
  }

  // 返回当前时间和开始倒计时函数
  return {
    currentTime,
    start
  }
}
